/**登陆后的nav条右侧的小鸟图标 */
import React, {useState} from 'react';
import './index.less';
import {Drawer, Button} from 'antd';
import {TwitterOutlined} from '@ant-design/icons';
import TaskListDate from './taskListDate';
import {connect} from 'react-redux';
import {get_task_date_list, get_all_task} from '../../redux/action/actions';

const CDrawer = (props) => {
  const [isSeen, setSeen] = useState(false);

  const handleClick = () => {
    setSeen(true);
    document.querySelector('.twitter_icon').style.marginRight = '260px';
    props.get_task_date_list();
    props.get_all_task();
  }
  const onClose = () => {
    setSeen(false);
    document.querySelector('.twitter_icon').style.marginRight = '';
  }
  const {dateList} = props.task_date_list_reducer;
  const {task} = props.get_all_task_reducer;
  return (
    <div>
      <Button type="text" onClick={handleClick} title="点击查看任务列表">
        <TwitterOutlined className="twitter_icon"/>
      </Button>
      <Drawer
        title="Task List Date"
        placement="right"
        closable={false}
        onClose={onClose}
        visible={isSeen}
      >
        <TaskListDate dateList={dateList} task={task} />
      </Drawer>
    </div>
  )
}

export default connect(
  state => state,
  {get_task_date_list, get_all_task}
)(CDrawer);